<template>
  <basic-container :btnFlag=true>
    <div class="card-border">
      <card-header :header-data="headerData"></card-header>
      <div style="float: right;margin-right: 17px;margin-top: 16px;" v-if="toDoOrnot=='0'">
        <el-button type="success" size="medium" @click="addCollectionFile()" v-if="singleOrNot=='1'">上传材料</el-button>
        <el-button type="warning" size="medium" @click="replenishCollectionFile()"
                   v-if="singleOrNot=='0'&&statetemp=='3'">补充
        </el-button>

        <el-button type="primary"
                   size="medium"
                   @click="submitCheck()"
                   v-if="singleOrNot=='1'&&(statetemp=='0'||statetemp=='2'||statetemp=='1')">提交反馈
        </el-button>
        <el-button size="medium" @click="goBack()">关 闭</el-button>
      </div>
      <div class="card-body">
        <avue-crud :data="levyResultData"
                   :option="tableoption"
                   :page="page"
                   :table-loading="tableLoading"
                   @on-load="getResultList"
                   @size-change="sizeChange"
                   @current-change="currentChange"
                   class="avuecrud">
          <template slot-scope="scope" slot="menu">
            <div class="menu-title" @click.stop="downloadCollectionFile(scope.row,scope.index)">
              <i class="iconfont iconview icon-primary"></i>
              <p class="menu-title-text">下载</p>
            </div>
          </template>
        </avue-crud>
      </div>
      <el-dialog title="上传材料" :visible.sync="dialogVisible" width="1000px">
        <el-form
          label-width="130px"
          :model="projectForm"
          style="padding-right: 30px;"
          :rules="collectionInfosrules"
          ref="projectForm"
        >
          <el-row>
            <el-col :span="16">
              <el-form-item class="form-item-release" label="反馈内容 :" prop="updateReason">
                <el-input
                  type="textarea"
                  v-model="projectForm.updateReason"
                  placeholder="请输入反馈内容"
                  rows="3"
                >
                </el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <div class="form-group-file">
            <span class="form-label-file"><font style="color: #F56C6C;margin-right: 5px;">*</font>材料 :</span>
            <el-upload
              class="upload-demo"
              action="string"
              :http-request="submitUploadMixin"
              :on-preview="handlePreviewMixin"
              :on-remove="handleRemoveMixin"
              :file-list="fileListMixin"
              :auto-upload="true"
              :on-change="fileChangeMixin">
              <el-button slot="trigger" size="small" type="primary">材料上传</el-button>
            </el-upload>
          </div>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="cancel()">取 消</el-button>
          <el-button type="primary" @click="comitYes()">确定</el-button>
        </div>
      </el-dialog>
      <el-dialog title="通知反馈部门补充材料" :visible.sync="dialogVisiblereject">
        <el-form
          label-width="130px"
          :model="rejectForm"
          style="padding-right: 30px;"
          :rules="rejectFormRules"
          ref="rejectForm"
        >
          <el-row>
            <el-col :span="22" style="margin-top: 27px;">
              <el-form-item class="form-item" label="补充理由 :" prop="opinion">
                <el-input
                  type="textarea"
                  :autosize="{ minRows: 4, maxRows: 4}"
                  placeholder="请输入补充理由"
                  v-model="rejectForm.opinion"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="rejectcancel()">取 消</el-button>
          <el-button type="primary" @click="rejectcomitYes()">确 定</el-button>
        </div>
      </el-dialog>
    </div>
  </basic-container>
</template>

<script>
  import {
    getCollectionFileList,
    levyDelete,
    addCollectionFile,
  } from "@/api/subject";
  import {
    replenishCollectionFile, submitCheck
  } from "@/api/fileTask";

  import relatedfile from "@/mixins/relatedfile";
  import {filedownload} from "@/api/system";
  import {collectionInfosrules, rejectFormRules} from "@/const/infoRules";

  export default {
    name: "collectionFeedback",
    mixins: [relatedfile],
    created() {
      this.projectForm.fileTaskId = this.$route.params.id;
      this.singleOrNot = this.$route.query.singleOrNot;
      this.statetemp = this.$route.query.state;
      this.toDoOrnot = this.$route.query.toDoOrnot;
    },
    data() {
      return {
        headerData: {
          title: '材料收集文件列表'
        },
        toDoOrnot:'0',
        levyResultData: [],
        page: {
          total: 0, // 总页数
          currentPage: 1, // 当前页数
          pageSize: 10 // 每页显示多少条
        },
        tableoption: {
          page: true,
          menuWidth: 150,
          addBtn: false,
          editBtn: false,
          addRowBtn: false,
          indexLabel: "序号",
          index: true,
          indexWidth:70,
          cellBtn: false,
          delBtn: false,
          columnBtn: false,
          refreshBtn: false,
          filterBtn: false,
          searchBtn: false,
          keyId: "id",
          column: [
            {
              label: "文件名",
              prop: "fileFullName",
              cell: true
            },
            {
              label: "反馈内容",
              prop: "updateReason",
              cell: true
            },
            {
              label: "上传人",
              prop: "uploadNickname",
              cell: true
            },
            {
              label: "上传时间",
              prop: "uploadTime",
              cell: true
            },
          ]
        },
        tableLoading: false,
        dialogVisible: false,
        projectForm: {
          fileIds: [],
          fileTaskId: '',
          basisFileId: '',
          updateReason: '',
          relateId: 0,
        },
        singleOrNot: '',
        collectionInfosrules: collectionInfosrules,
        rejectForm: {
          opinion: '',
          fileTaskId: 0,
        },
        dialogVisiblereject: false,
        rejectFormRules: rejectFormRules,
        statetemp: '',
      }
    },
    methods: {
      goBack(){
        this.$router.go(-1)
      },
      currentChange(currentPage) {
        var page = this.page;
        page.currentPage = currentPage;
        this.getResultList(page);
      },
      sizeChange(pageSize) {
        var page = this.page;
        page.pageSize = pageSize;
        this.getResultList(page);
      },
      getType(type){
        let curType = 0;
        switch (type) {
          case '0':
            curType = '1';
            break;
          case '1':
            curType = '4';
            break
        }
        return curType
      },
      getResultList(page) {
        getCollectionFileList(Object.assign({
          current: page.currentPage,
          size: page.pageSize,
          type: this.getType(this.$route.query.type),
          relateId: this.$route.params.id, //fileTaskId
        })).then(response => {
          this.levyResultData = response.data.data.records;
          this.page.total = response.data.data.total;
        })
      },
      addCollectionFile() {
        this.dialogVisible = true;
      },
      cancel() {
        this.projectForm.basisFileId = '';
        this.dialogVisible = false;
      },
      comitYes() {
        if (this.fileListMixin.length == 0) {
          this.$notify({
            title: "提醒",
            type: "warning",
            message: "请上传材料",
            duration: 2000
          });
          return;
        }
        this.$refs.projectForm.validate(valid => {
          if (valid) {
            this.$confirm("确定上传此材料吗?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              //将多个相关材料的附件id拼成逗号隔开的字符串放在 this.projectForm.fileId 中
              var arr = [];
              for (var item in this.fileListMixin) {
                arr.push(this.fileListMixin[item].url);
              }
              this.projectForm.fileIds = arr;
              this.projectForm.relateId = this.$route.params.id;
              this.projectForm.type = this.getType(this.$route.query.type);

              addCollectionFile(this.projectForm).then(response => {
                if (response.data.code == 0) {
                  this.$notify({
                    title: '成功',
                    message: '上传成功',
                    type: 'success',
                    duration: 2000
                  });
                  this.$router.go(0);
                }
              })
            })
          }
        })
      },
      downloadCollectionFile(row) {
        this.$confirm("确定下载此材料吗?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          this.downloadFile(row.fileId, row.fileFullName)
        })
      },
      // 删除
      deleteCollectionFile(row, index) {
        this.$confirm("确定删除此材料吗?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          let fileIds = [];
          fileIds.push(row.fileId);
          deleteCollectionFile({
            type: '1',
            relateId: this.$route.params.id,
            fileIds: fileIds
          }).then(response => {
            if (response.data.code == 0) {
              this.getResultList(this.page);
              this.$notify({
                title: '成功',
                message: '删除成功',
                type: 'success',
                duration: 2000
              });
            }
          })
        })
      },
      // 附件下载
      downloadFile(fileId, fileName) {
        filedownload(fileId).then(response => {
          if (response.status == 200) {
            this.download(response.data, fileName)
          }
        }).catch((error) => {
          this.$notify({
            title: "失败",
            message: "上传失败[" + error + "]",
            type: "error",
            duration: 2000
          });
        })
      },
      // 下载文件
      download(data, filename) {
        if (data == null) {

        } else {
          let url = window.URL.createObjectURL(new Blob([data]));
          let link = document.createElement('a');
          link.style.display = 'none';
          link.href = url;
          link.setAttribute('download', filename);
          document.body.appendChild(link);
          link.click()
        }
      },
      replenishCollectionFile() {
        this.dialogVisiblereject = true;
      },
      rejectcancel() {
        this.dialogVisiblereject = false;
      },
      rejectcomitYes() {
        this.rejectForm.fileTaskId = this.$route.params.id;
        this.$refs.rejectForm.validate(valid => {
          if (valid) {
            this.$confirm("确定通知反馈部门补充材料吗?", "提示", {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              replenishCollectionFile(this.rejectForm).then(response => {
                if (response.data.code == 0) {
                  this.$notify({
                    title: "成功",
                    message: "通知成功",
                    type: "success",
                    duration: 2000
                  });
                  this.$router.go(0);
                }
              })
            })
          }
        })
      },
      submitCheck() {
        this.$confirm("确定提交审核吗?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          submitCheck(this.$route.params.id).then(response => {
            if (response.data.code == 0) {
              this.$notify({
                title: '成功',
                message: '提交成功',
                type: 'success',
                duration: 2000
              });
              this.$router.go(-1);
            }
          })
        })
      },
    }
  }
</script>

<style lang="scss" scoped>
  .card-body {
    padding: 10px;
    min-height: 400px
  }
  /deep/ .avue-crud__menu{
    min-height:20px
  }
  .form-item {
    font-weight: 600;
  }
</style>
